// components/dropdown/dropdown.js
Component({
	options: {
		addGlobalClass: true,
	},
	relations: {
		'../dropdownMenu/dropdownMenu': {
			type: 'child', // 关联的目标节点应为子节点
			linked: function (target) {
				// 每次有custom-li被插入时执行，target是该节点实例对象，触发在该节点attached生命周期之后
				// console.log(target)
				// console.log(target.data)
			},
			linkChanged: function (target) {
				// 每次有custom-li被移动后执行，target是该节点实例对象，触发在该节点moved生命周期之后
			},
			unlinked: function (target) {
				// 每次有custom-li被移除时执行，target是该节点实例对象，触发在该节点detached生命周期之后
				// console.log(target)
			},
		},
	},
	/**
	 * 组件的属性列表
	 */
	properties: {},

	/**
	 * 组件的初始数据
	 */
	data: {
		children: [],
	},

	ready() {
		this.getList()
	},

	/**
	 * 组件的方法列表
	 */
	methods: {
		getList: function () {
			var children = this.getRelationNodes('../dropdownMenu/dropdownMenu')
			this.createSelectorQuery()
				.select('.dropdown-box')
				.boundingClientRect(rect => {
					children.map((v, i) => {
						v.setData({
							index: Number(i + 1),
							width: rect.width / children.length,
						})
					})
					this.setData({
						children,
					})
				})
				.exec()
		},
		setOpen(index) {
			;(this.data.children || []).map(v => {
				v.data.index == index
					? null
					: v.setData({
							open: false,
					  })
			})
		},
	},
})
